import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import {Card, Divider} from 'antd';
import {formatMessage} from '../intl';
import FileUpload from './FileUpload';
import ImageUpload from './ImageUpload';
import {claimAthType, fileType} from '../../Enum';
import DescriptionList from 'ant-design-pro/lib/DescriptionList';
const EMPTY_ARRAY = [];
class ClaimAthPanel extends PureComponent {
    state = {
        showSelectPartPanel: false
    }
    onChangeUploadPhoto = data => {
        const type = this.props.type;
        this.props.onChangeUploadPhoto(data, type);
    };
    onRemovePhoto = data => {
        const type = this.props.type;
        this.props.onRemovePhoto(data, type);
    };
    onChangeUploadFile = data => {
        const type = this.props.type;
        this.props.onChangeUploadFile(data, type);
    };
    onRemoveFile = data => {
        const type = this.props.type;
        this.props.onRemoveFile(data, type);
    };
    render() {
        const attachmentsPhoto = this.props.claimAthDetails
            ? this.props.claimAthDetails.find(item => item.type === this.props.type && item.fileType === fileType.图片) ||
            EMPTY_ARRAY : EMPTY_ARRAY;
        const attachmentsFile = this.props.claimAthDetails
            ? this.props.claimAthDetails.find(item => item.type === this.props.type && item.fileType === fileType.文件) ||
            EMPTY_ARRAY : EMPTY_ARRAY;
        return (
            <Card
                title={this.props.type === claimAthType.图片资料 ? formatMessage({
                    id: 'claimAthPanel.operation.photo',
                    defaultMessage: '图片资料'
                }) : formatMessage({
                    id: 'claimAthPanel.operation.invoice',
                    defaultMessage: '发票扫描图片'
                })}>
                <DescriptionList>
                    <ImageUpload
                        onChange={this.onChangeUploadPhoto}
                        onRemove={this.onRemovePhoto}
                        fileList={attachmentsPhoto.attachments || EMPTY_ARRAY} />
                </DescriptionList>
                <Divider />
                <DescriptionList>
                    <FileUpload
                        onChange={this.onChangeUploadFile}
                        onRemove={this.onRemoveFile}
                        fileList={attachmentsFile.attachments || EMPTY_ARRAY} />
                </DescriptionList>
            </Card>
        );
    }
}

ClaimAthPanel.propTypes = {
    claimAthDetails: PropTypes.array,
    type: PropTypes.number,
    onChangeUploadFile: PropTypes.func,
    onChangeUploadPhoto: PropTypes.func,
    onRemoveFile: PropTypes.func,
    onRemovePhoto: PropTypes.func,
};

export default ClaimAthPanel;
